<template>
	<!-- 活动报名 -->
	<view class="container page">
		<view class="activity-module mar-t-15">
			<view class="title tq-text-line2">
				<text class="font-size-18 font-color-222 font-bold">{{info.name || ''}}</text>
			</view>
			<view class="activity-time mar-t-20">
				<view>
					<text class="font-size-15 font-color-999">活动时间</text>
					<text
						class="font-size-12 mar-l-10 font-color-333"
					>{{transformTime(info.start_time) || ''}} 至 {{transformTime(info.end_time) ||''}}</text>
				</view>
			</view>
		</view>
		<view class="enroll-user-info mar-t-20">
			<view class="clear">
				<text class="font-size-18 font-bold font-color-333 pull-l">报名信息</text>
				<text class="font-size-15 font-color-333 pull-r font-color-e9">请完善报名信息</text>
			</view>
			<view class="mar-t-20 font-size-17">
				<view class="flex info-item align-center border-b-1">
					<view class="font-color-666 title">姓名</view>
					<view class="flex-1 mar-l-15">
						<input type="text" v-model="linkman" placeholder="请输入姓名" />
					</view>
				</view>
				<view class="flex info-item align-center border-b-1">
					<view class="font-color-666 title">联系电话</view>
					<view class="flex-1 mar-l-15">
						<input type="number" v-model="mobile" placeholder="请输入联系电话" />
					</view>
				</view>
			</view>
		</view>
		<view class="tipText font-size-14 font-color-999 text-center">
			报名、签到、评价各得5积分，当天最高不得超过20分
		</view>
		<view class="footer text-center font-size-16 font-bold" @click="subEnroll">确认报名</view>
	</view>
</template>

<script>
import { getActDetail, subEnroll } from '@/utils/http'
export default {
	data() {
		return {
			id: '',
			info: '',
			followed: false,
			linkman: '',
			mobile: ''
		}
	},
	methods: {
		detail() {
			const _that = this
			getActDetail({ id: this.id }).then(res => {
				if (res) {
					_that.info = res
				}
			})
		},
		//提交报名
		subEnroll() {
			subEnroll({
				id: this.id,
				mobile: this.mobile,
				linkman: this.linkman
			}).then(res => {
				if (res) {
					this.successToShow('报名成功')
					let url = '/pages/activity/success?order_no=' + res.order_no
					setTimeout(() => {
						uni.redirectTo({
							url
						})
					}, 1000)
				}
			})
		}
	},
	onLoad(option) {
		this.id = option.id
		this.detail()
	}
}
</script>

<style scoped>
.activity-module {
	padding: 22px 10px;
	box-shadow: 1px 3px 15px 1px #f3ecec;
}
.activity-module .title {
	padding-bottom: 13px;
	border-bottom: 1px dashed #e8e8e8;
}
.enroll-user-info .info-item {
	padding: 20px 10px;
}
.enroll-user-info .info-item .title {
	font-size: 18px;
	width: 80px;
}
.enroll-user-info .info-item input {
	/* font-size: 17px; */
	padding-left: 5px;
}

</style>